import React, { Component } from 'react'
import NavHeader from '@/components/NavHeader';
import { getDetailApi } from '@/api/detailApi'
import './style.scss'
import SearchBtn from '@/components/SearchBtn';

class Detail extends Component {

  state = {
    info: null
  }

  async componentDidMount() {
    let ret = await getDetailApi(this.props.match.params.id)
    this.setState({ info: ret.data.data })
  }

  render() {
    let { info } = this.state
    return (
      <div className='detail-container'>
        <NavHeader>{info && info.name}</NavHeader>
        {
          info
            ?
            <>
              <img className='logo' src={info.img} />
              <SearchBtn icon={false} title="点击收藏" />
              <div className='content' dangerouslySetInnerHTML={{ __html: info.content }}></div>
            </>
            :
            <div>加载中...</div>
        }
      </div>
    );
  }
}

export default Detail;
